<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.prime.com.tr/ui">
    <h:head>
        <title>Customer</title>

    </h:head>
    <f:view beforePhase="#{UserDisplayManagedBean.doDisplay}">
        <f:view beforePhase="#{CustomerManagedBean.initView}">
            <h:body>      

                <h:form prependId="false">
                    <!-- IDLE DIALOG for -->
                    <p:confirmDialog message="You have been idle for 5 minutes. Do you want to continue?"  
                                     showEffect="bounce" hideEffect="explode"  
                                     header="Warning message" severity="alert" widgetVar="confirmation">  
                        <p:commandButton value="Yes" onclick="confirmation.hide()" type="button" /> 
                        <p:commandButton value="No" update="panel" oncomplete="confirmation.hide()"  
                                         actionListener="#{UserManagedBean.doLogout}" /> 
                    </p:confirmDialog>

                    <p:idleMonitor timeout="300000" onidle="confirmation.show()" />  
                    <!--END OF IDLE DIALOG-->

                    <p:growl id="msgs" showDetail="true"/>
                    <p:growl id="notif" showDetail="true"/>
                    <div id="top" class="top" style="margin-top:0%; margin-bottom:0%">
                        <h:graphicImage value="/image/newHeader.jpg"/>

                    </div>
                    <div id="content" style="font-family:Tahoma;font-size:12px">
                        <table>
                            <tr>
                                <td>
                                    <p:toolbar style="font-size:100%;margin-top:0%;height:30px;width:200px"> 
                                        <p:toolbarGroup align="right" >
                                            <p:button title="Home" image="ui-icon-home" outcome="SalesDeptWorkspace"/>                                  
                                            <p:button title="Notes" image="ui-icon-note" />                                    
                                            <p:button title="Mail" outcome="messages" image="ui-icon-mail-closed"/>                                    
                                            <p:button title="Edit Preferences" image="ui-icon-gear"/>                                   
                                            <p:button title="Help" image="ui-icon-help"/>
                                            <p:commandButton title="Log Out" immediate="true" type="submit" image="ui-icon-close" actionListener="#{UserManagedBean.doLogout}"/> 
                                        </p:toolbarGroup>
                                    </p:toolbar></td>
                                <td>
                                    <h:graphicImage value="people-icon.png" style="width:40px;height:40px" />
                                    <h:outputText value="         "/>
                                    <h:outputText value="Customers" style="font-family:Tahoma;font-size:20px;font-weight:bolder"/>
                                    <p:spacer width="100" height="10"/>
                                </td>
                            </tr>
                            <tr>
                                <td style="vertical-align:top">
                                    <p:menu style="width:200px;font-size: 12px;font-family: Tahoma;border-style: ridge">  
                                        <p:submenu label="Sales Force Automation" >  
                                            <p:menuitem value="Customers" url="http://localhost:8080/MerlionERP-war/CRM/customers.xhtml" ajax="false" icon="ui-icon ui-icon-person"/>  
                                            <p:menuitem value="Contacts" url="http://localhost:8080/MerlionERP-war/CRM/contacts.xhtml" ajax="false" icon="ui-icon ui-icon-person" />
                                            <p:menuitem value="Leads" url="http://localhost:8080/MerlionERP-war/CRM/salesLeads.xhtml" ajax="false" icon="ui-icon ui-icon-person" />
                                        </p:submenu>
                                        <p:submenu label="Sales Order Processing">
                                            <p:menuitem value="Pricebooks" url="http://localhost:8080/MerlionERP-war/CRM/pricebooks.xhtml" ajax="false" icon="ui-icon ui-icon-document"/>                                          
                                            <p:menuitem value="Inquiries" url="http://localhost:8080/MerlionERP-war/CRM/salesInquiries.xhtml" ajax="false" icon="ui-icon ui-icon-document"/>
                                            <p:menuitem value="Quotations" url="http://localhost:8080/MerlionERP-war/CRM/quotations.xhtml" ajax="false" icon="ui-icon ui-icon-document"/>
                                            <p:menuitem value="Purchase Orders" url="http://localhost:8080/MerlionERP-war/CRM/purchaseOrders.xhtml" ajax="false" icon="ui-icon ui-icon-document"/>
                                            <p:menuitem value="Sales Orders" url="http://localhost:8080/MerlionERP-war/CRM/salesOrders.xhtml" ajax="false" icon="ui-icon ui-icon-document"/>
                                            <p:menuitem value="Delivery Orders" url="http://localhost:8080/MerlionERP-war/CRM/deliveryOrdersCRM.xhtml" ajax="false" icon="ui-icon ui-icon-document"/>
                                        </p:submenu>  
                                    </p:menu>
                                    <p:menu type="tiered" style="width:200px;font-family:Tahoma;font-size:12px">
                                        <p:submenu label="Create New" icon="ui-icon ui-icon-extlink">  
                                            <p:menuitem value="Customer" url="http://localhost:8080/MerlionERP-war/CRM/createNewCustomer.xhtml" />
                                            <p:menuitem value="Sales Lead" url="http://localhost:8080/MerlionERP-war/CRM/createNewSalesLead.xhtml" /> 
                                            <p:menuitem value="Contact" url="http://localhost:8080/MerlionERP-war/CRM/createNewContact.xhtml" />
                                            <p:menuitem value="Inquiry" url="http://localhost:8080/MerlionERP-war/CRM/addSalesInquiry.xhtml"/>
                                            <p:menuitem value="Quotation" url="http://localhost:8080/MerlionERP-war/CRM/addQuotation.xhtml"/>
                                            <p:menuitem value="Purchase Order" url="http://localhost:8080/MerlionERP-war/CRM/addPurchaseOrder.xhtml"/>
                                            <p:menuitem value="Sales Order" url="http://localhost:8080/MerlionERP-war/CRM/addSalesOrder.xhtml"/>
                                            <p:menuitem value="Delivery Order" url="http://localhost:8080/MerlionERP-war/CRM/addDeliveryOrder.xhtml"/>      
                                        </p:submenu>
                                    </p:menu>
                                    <p:calendar mode="inline" style="font-size:11px;font-family:Tahoma"/>
                                </td>

                                <td style="vertical-align:top">
                                    <!-- <p:toolbar style="font-size: 70%;width: 99.5% "> 
                                        <p:toolbarGroup align="left" id="toolbar">  
                                            <p:button value="New Lead" outcome="createNewSalesLead" style="border-right-style: hidden" />
                                            <p:divider/>
                                            <p:button value="New Customer" outcome="createNewCustomer" style="border-right-style: hidden"/>                                                  
                                            <p:divider/>
                                            <p:button value="New Contact" outcome="createNewContact" />
                                            <p:divider/>
                                            <p:button value="New Inquiry" outcome="addSalesInquiry"/>
                                            <p:divider/>
                                            <p:button value="New Quotation"  outcome="addQuotation"/>
                                            <p:divider/>
                                            <p:button value="New Purchase Order"  outcome="addPurchaseOrder"/>
                                            <p:divider/>
                                            <p:button value="New Sales Order"  outcome="addSalesOrder"/>
                                        </p:toolbarGroup>   
        
                                    </p:toolbar> -->


                                    <p:toolbar style="font-size: 11px;width: 99.5%"> 
                                        <p:toolbarGroup align="left">  
                                            <p:button value="New Customer" outcome="createNewCustomer" image="ui-icon-plus"/>
                                            <p:commandButton title="Delete" image="ui-icon ui-icon-trash"
                                                             value="Delete" oncomplete="deleteDialog.show()"  />
                                            <p:commandButton value="Customer Report" ajax="false" immediate="true" actionListener="#{jasperManagedBean.generateCustomerReport}" />
                                            <p:menuButton value="Options"  >
                                                <p:menuitem value="Add Shipping Address" update="addshipping" oncomplete="addShippingAddressDialog.show()">

                                                </p:menuitem>        
                                                <p:menuitem value="Add Billing Address" update="addbilling" oncomplete="addBillingAddressDialog.show()">

                                                </p:menuitem>

                                                <p:menuitem value="View Address" update="chooseClient chooseAddress addressTable" oncomplete="viewAddressDialog.show()">

                                                </p:menuitem>                   
                                            </p:menuButton>


                                        </p:toolbarGroup>  

                                    </p:toolbar> 


                                    <!--DIALOG FOR ADDING SHIPPING ADDRESS-->
                                    <p:dialog header="Add Shipping Address" modal="true" widgetVar="addShippingAddressDialog" resizable="false"  
                                              width="700" showEffect="blind" hideEffect="blind">  

                                        <center>
                                            <h:panelGrid id="addshipping" columns="3" cellpadding="2" cellspacing="2" style="font-family:Tahoma; font-size:10px">  

                                                <h:outputText value="Company Name" /> 
                                                <h:outputText value=":"/>
                                                <h:selectOneMenu  value="#{CustomerManagedBean.companyId2}">
                                                    <f:selectItem itemLabel="Select Company" itemValue=""/>
                                                    <f:selectItems value="#{CustomerManagedBean.customers}" var="customers"
                                                                   itemLabel ="#{customers.id} - #{customers.name}" itemValue="#{customers.id}"/>
                                                </h:selectOneMenu>

                                                <h:outputText value="Shipping Street" />
                                                <h:outputText value=":"/>
                                                <p:inputText value="#{CustomerManagedBean.shippingStreet}"  />  


                                                <h:outputText value="Shipping State" />
                                                <h:outputText value=":"/>
                                                <p:inputText value="#{CustomerManagedBean.shippingState}"   />  


                                                <h:outputText value="Shipping City" />
                                                <h:outputText value=":"/>             
                                                <p:inputText value="#{CustomerManagedBean.shippingCity}"  />  


                                                <h:outputText value="Shipping Code" />
                                                <h:outputText value=":"/>
                                                <p:inputText value="#{CustomerManagedBean.shippingCode}"  />  


                                                <h:outputText value="Shipping Country" />
                                                <h:outputText value=":"/>                           
                                                <p:inputText value="#{CustomerManagedBean.shippingCountry}" />  


                                                <h:outputText value="Set as Primary Shipping Address?"/>
                                                <h:selectOneRadio  value="#{CustomerManagedBean.primaryShippingAddress}" >
                                                    <f:selectItem itemValue="Yes" itemLabel="Yes"/>   
                                                    <f:selectItem itemValue="No" itemLabel="No"/>
                                                </h:selectOneRadio>
                                                <h:outputText value=""/>

                                                <p:commandButton value="Add" update="panel" actionListener="#{CustomerManagedBean.addShippingAddress}"   
                                                                 oncomplete="addShippingAddressDialog.hide()" image="ui-icon ui-icon-check" />  
                                                <p:commandButton value="Cancel" onclick="addShippingAddressDialog.hide()" type="button" image="ui-icon ui-icon-close"/>  
                                            </h:panelGrid>  
                                        </center>
                                    </p:dialog>

                                    <!--DIALOG FOR ADDING BILLING ADDRESS-->
                                    <p:dialog header="Add Billing Address" modal="true" widgetVar="addBillingAddressDialog" resizable="false"  
                                              width="700" showEffect="blind" hideEffect="blind">  

                                        <center>
                                            <h:panelGrid id="addbilling" columns="3" cellpadding="2" cellspacing="2" style="font-family:Tahoma; font-size:10px">  

                                                <h:outputText value="Company Name" /> 
                                                <h:outputText value=":"/>
                                                <h:selectOneMenu value="#{CustomerManagedBean.companyId}">
                                                    <f:selectItem itemLabel="Select Company" itemValue=""/>
                                                    <f:selectItems value="#{CustomerManagedBean.customers}" var="customers"
                                                                   itemLabel ="#{customers.id} - #{customers.name}" itemValue="#{customers.id}"/>
                                                </h:selectOneMenu>

                                                <h:outputText value="Billing Street" />
                                                <h:outputText value=":"/>
                                                <p:inputText value="#{CustomerManagedBean.billingStreet}"  />  


                                                <h:outputText value="Billing State" />
                                                <h:outputText value=":"/>
                                                <p:inputText value="#{CustomerManagedBean.billingState}" />  


                                                <h:outputText value="Billing City" />
                                                <h:outputText value=":"/>
                                                <p:inputText value="#{CustomerManagedBean.billingCity}" />  


                                                <h:outputText value="Billing Code" />
                                                <h:outputText value=":"/>
                                                <p:inputText value="#{CustomerManagedBean.billingCode}" />  


                                                <h:outputText value="Billing Country" />
                                                <h:outputText value=":"/>
                                                <p:inputText value="#{CustomerManagedBean.billingCountry}"  />  


                                                <h:outputText value="Set as Primary Billing Address?"/>
                                                <h:selectOneRadio value="#{CustomerManagedBean.primaryBillingAddress}" >
                                                    <f:selectItem itemValue="Yes" itemLabel="Yes"/>   
                                                    <f:selectItem itemValue="No" itemLabel="No"/>
                                                </h:selectOneRadio>

                                                <h:outputText value=""/>

                                                <p:commandButton value="Add" update="panel" actionListener="#{CustomerManagedBean.addBillingAddress}"   
                                                                 oncomplete="addBillingAddressDialog.hide()" image="ui-icon ui-icon-check" />  
                                                <p:commandButton value="Cancel" onclick="addBillingAddressDialog.hide()" type="button" image="ui-icon ui-icon-close"/>  

                                            </h:panelGrid>  
                                        </center>
                                    </p:dialog>




                                    <p:dialog header="View Address" modal="true" widgetVar="viewAddressDialog" resizable="false"  
                                              width="900" showEffect="blind" hideEffect="blind">  


                                        <center>

                                            <h:panelGrid id="chooseClient" columns="3" style="font-family:Tahoma;font-size:11px" >
                                                <h:outputText value="Customer"/>
                                                <h:outputText value=":"/>
                                                <h:selectOneMenu value="#{CustomerManagedBean.companyId}">
                                                    <f:selectItem itemLabel="Select Company" itemValue=""/>
                                                    <f:selectItems value="#{CustomerManagedBean.customers}" var="customers"
                                                                   itemLabel ="#{customers.id} - #{customers.name}" itemValue="#{customers.id}"/>
                                                    <p:ajax update="chooseAddress"/>
                                                </h:selectOneMenu>

                                                <h:outputText value="Choose Address"/>
                                                <h:outputText value=":"/>
                                                <h:selectOneMenu id="chooseAddress" value="#{CustomerManagedBean.addressType}">
                                                    <f:selectItem itemLabel="Select Address Type" itemValue=""/>
                                                    <f:selectItem itemLabel="Billing Address" itemValue="B"/>
                                                    <f:selectItem itemLabel="Shipping Address" itemValue="S"/>
                                                    <p:ajax update="addressTable" 
                                                            listener="#{CustomerManagedBean.handleAddressTypeChange}"/>
                                                </h:selectOneMenu>

                                            </h:panelGrid>

                                            <p:dataTable id="addressTable" value="#{CustomerManagedBean.addressList}"
                                                         var="address" paginator="true" rows="5"
                                                         paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                                         rowEditListener="#{CustomerManagedBean.onEditRowAddress}"
                                                         rowsPerPageTemplate="5,10,15" style="font-family:Tahoma;font-size:11px;width:100%"                      
                                                         emptyMessage="No data found with given criteria" widgetVar="addressTable"> 


                                                <f:facet name="header">                           
                                                    <p:outputPanel style="text-align:right"  >
                                                        <h:outputText value="Search all fields:"/>  
                                                        <p:inputText id="globalFilter" onkeyup="addressTable.filter()" style="right:-100px;width:150px" />  
                                                    </p:outputPanel>
                                                </f:facet>

                                                <p:column style="width: 20px;border-left-color:transparent;border-right-color:transparent"> 
                                                    <!--DELETE-->
                                                    <p:commandButton title="Delete" image="ui-icon ui-icon-trash" ajax="true" immediate="true"
                                                                     update="panel" oncomplete="addressdialog.show()">
                                                        <f:setPropertyActionListener target="#{CustomerManagedBean.selectedAddress}"
                                                                                     value="#{address}"/>
                                                    </p:commandButton>

                                                </p:column>  

                                                <p:column style="width:20px;border-left-color:transparent;border-right-color:transparent">    
                                                    <p:rowEditor/>
                                                </p:column>


                                                <p:column headerText="ID"  sortBy="#{address.id}" filterBy="#{address.id}" 
                                                          filterStyle="width:60px" filterMatchMode="contains" style="border-left-color:transparent;border-right-color:transparent">   
                                                    <h:outputText value="#{address.id}" />
                                                </p:column>


                                                <p:column headerText="Street" sortBy="#{address.street}" filterBy="#{address.street}" 
                                                          filterStyle="width:60px" filterMatchMode="contains" style="border-left-color:transparent;border-right-color:transparent">  
                                                    <p:cellEditor>
                                                        <f:facet name="output">  
                                                            <h:outputText value="#{address.street}" />  
                                                        </f:facet>  
                                                        <f:facet name="input">
                                                            <p:inputText value="#{address.street}" style="width:100%"/>
                                                        </f:facet>
                                                    </p:cellEditor>
                                                </p:column>  


                                                <p:column headerText="City" sortBy="#{address.city}" filterBy="#{address.city}" filterMatchMode="contains" 
                                                          filterStyle="width:60px" style="border-left-color:transparent;border-right-color:transparent">  
                                                    <p:cellEditor>
                                                        <f:facet name="output">  
                                                            <h:outputText value="#{address.city}" />  
                                                        </f:facet>
                                                        <f:facet name="input">
                                                            <p:inputText value="#{address.city}" style="width:100%" />
                                                        </f:facet>
                                                    </p:cellEditor>
                                                </p:column>  


                                                <p:column headerText="State" sortBy="#{address.state}" filterBy="#{address.state}" 
                                                          filterStyle="width:60px" filterMatchMode="contains" style="border-left-color:transparent;border-right-color:transparent">  
                                                    <p:cellEditor>
                                                        <f:facet name="output">  
                                                            <h:outputText value="#{address.state}" />  
                                                        </f:facet>
                                                        <f:facet name="input">
                                                            <p:inputText value="#{address.state}" style="width:100%"/>
                                                        </f:facet>
                                                    </p:cellEditor>
                                                </p:column>  


                                                <p:column headerText="Postal Code" sortBy="#{address.code}" filterBy="#{address.code}" 
                                                          filterStyle="width:60px" filterMatchMode="contains" style="border-left-color:transparent;border-right-color:transparent">  
                                                    <p:cellEditor>
                                                        <f:facet name="output">  
                                                            <h:outputText value="#{address.code}" />  
                                                        </f:facet>
                                                        <f:facet name="input">
                                                            <p:inputText value="#{address.code}" style="width:100%"/>  
                                                        </f:facet>
                                                    </p:cellEditor>
                                                </p:column>  

                                                <p:column headerText="Country" sortBy="#{address.country}" filterBy="#{address.country}" 
                                                          filterStyle="width:60px" filterMatchMode="contains" style="border-left-color:transparent;border-right-color:transparent">  
                                                    <p:cellEditor>
                                                        <f:facet name="output">  
                                                            <h:outputText value="#{address.country}" />  
                                                        </f:facet>
                                                        <f:facet name="input">
                                                            <p:inputText value="#{address.country}" style="width:100%"/>  
                                                        </f:facet>
                                                    </p:cellEditor>
                                                </p:column>  


                                                <p:column headerText="Primary"> 

                                                    <h:outputText id="primaryY" value="Yes" rendered="#{address.primaryAddress}" />
                                                    <h:outputText id="primaryN" value="No" rendered="#{!address.primaryAddress}" />  

                                                </p:column>  

                                                <p:column style="width: 20px;border-left-color:transparent;border-right-color:transparent">
                                                    <p:commandButton value="Set as Primary" ajax="true" immediate="true"  update="panel" actionListener="#{CustomerManagedBean.setPrimaryAddress}">
                                                        <f:setPropertyActionListener target="#{CustomerManagedBean.selectedPrimary}" value="#{address}"/>
                                                        <p:ajax update="panel addressTable primaryY primaryN"/>
                                                    </p:commandButton>
                                                </p:column>

                                            </p:dataTable>
                                        </center>
                                    </p:dialog>

                                    <p:dataTable id="panel" 
                                                 var="customers" value="#{CustomerManagedBean.customers}"  
                                                 paginator="true" rows="5" 
                                                 paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                                 rowEditListener="#{CustomerManagedBean.onEditRowCustomer}"
                                                 rowsPerPageTemplate="5,10,15" style="font-size: 80%;width:100%"                     
                                                 selection="#{CustomerManagedBean.selectedCustomers}"
                                                 emptyMessage="No data found with given criteria" widgetVar="customerTable"> 


                                        <f:facet name="header">                           
                                            <p:outputPanel style="text-align:right"  >
                                                <h:outputText value="Search all fields:" style="margin-left:840px" />  
                                                <p:inputText id="globalFilter" onkeyup="customerTable.filter()" style="right:-100px;width:150px" />  
                                            </p:outputPanel>
                                        </f:facet>

                                        <p:column selectionMode="multiple"  /><!--style="border-left-color:transparent; border-right-color:transparent"-->

                                        <p:column headerText="View" style="width:20px;border-right-color:transparent"> <!--border-left-color:transparent;--> 
                                            <p:rowToggler />  
                                        </p:column> 

                                        <p:column headerText="Edit" style="width:20px;border-left-color:transparent;border-right-color:transparent">    
                                            <p:rowEditor/>
                                        </p:column>

                                        <p:column headerText="Del." style="width: 20px;border-left-color:transparent"> <!--border-right-color:transparent"-->
                                            <!--DELETE-->
                                            <p:commandButton title="Delete" image="ui-icon ui-icon-trash" ajax="true" immediate="true"
                                                             update="panel" oncomplete="customerdialog.show()">
                                                <f:setPropertyActionListener target="#{CustomerManagedBean.selectedCustomer}"
                                                                             value="#{customers}"/>
                                            </p:commandButton>

                                        </p:column>  


                                        <!--CUSTOMER ID-->
                                        <p:column headerText="ID"  sortBy="#{customers.id}" filterStyle="width:50px" filterBy="#{customers.id}" 
                                                  style="width:60px" filterMatchMode="contains" >
                                            <!-- style="border-left-color:transparent;border-right-color:transparent">-->   
                                            <h:outputText value="#{customers.id}" />
                                        </p:column>

                                        <!--CUSTOMER NAME-->
                                        <p:column headerText="Name" sortBy="#{customers.name}" filterBy="#{customers.name}" filterStyle="width:150px" filterMatchMode="contains" >
                                            <!--style="border-left-color:transparent;border-right-color:transparent"-->  
                                            <p:cellEditor>
                                                <f:facet name="output">  
                                                    <h:outputText value="#{customers.name}" />  
                                                </f:facet>  
                                                <f:facet name="input">
                                                    <p:inputText value="#{customers.name}" style="width:100%"/>
                                                </f:facet>
                                            </p:cellEditor>
                                        </p:column>  

                                        <!--CONTACT NUMBER-->
                                        <p:column headerText="Contact Number" sortBy="#{customers.contactNum}" filterBy="#{customers.contactNum}" filterMatchMode="contains" >
                                            <!--style="border-left-color:transparent;border-right-color:transparent">-->  
                                            <p:cellEditor>
                                                <f:facet name="output">  
                                                    <h:outputText value="#{customers.contactNum}" />  
                                                </f:facet>
                                                <f:facet name="input">
                                                    <p:inputText value="#{customers.contactNum}" style="width:100%" />
                                                </f:facet>
                                            </p:cellEditor>
                                        </p:column>  



                                        <!--TYPE-->
                                        <p:column headerText="Type" sortBy="#{customers.businessType}" filterBy="#{customers.businessType}" filterMatchMode="contains"> 
                                            <!--style="border-left-color:transparent;border-right-color:transparent">-->  
                                            <p:cellEditor>
                                                <f:facet name="output">  
                                                    <h:outputText value="#{customers.businessType}" />  
                                                </f:facet>
                                                <f:facet name="input">
                                                    <h:selectOneMenu value="#{customers.businessType}">
                                                        <f:selectItem itemValue="Direct" itemLabel="Direct"/>
                                                        <f:selectItem itemLabel="Wholesale" itemValue="Wholesale"/>
                                                    </h:selectOneMenu>
                                                </f:facet>
                                            </p:cellEditor>
                                        </p:column>  

                                        <!--EMAIL ADDRESS-->
                                        <p:column headerText="Email" sortBy="#{customers.emailAddress}" filterBy="#{customers.emailAddress}" 
                                                  filterMatchMode="contains"> 
                                            <!--style="border-left-color:transparent;border-right-color:transparent"-->  
                                            <p:cellEditor>
                                                <f:facet name="output">  
                                                    <h:outputText value="#{customers.emailAddress}" />  
                                                </f:facet>
                                                <f:facet name="input">
                                                    <p:inputText value="#{customers.emailAddress}" style="width:100%"/>  
                                                </f:facet>
                                            </p:cellEditor>
                                        </p:column>  

                                        <!--DATE CREATED-->
                                        <p:column sortBy="#{customers.dateCreated}" filterBy="#{customers.dateCreated}" 
                                                  filterStyle="width:150px" filterMatchMode="contains">
                                            <!--style="border-left-color:transparent;border-right-color:transparent"-->
                                            <f:facet name="header">
                                                <h:outputText value="Date Created"/>
                                            </f:facet>
                                            <h:outputText value="#{customers.dateCreated}"/>
                                        </p:column>

                                        <p:column style="width:40px">  
                                            <p:commandLink update="display1" oncomplete="editDialog.show()" title="Edit Details">
                                                <p:graphicImage value="about_icon.png" style="width:20px;height:20px"/>
                                                <f:setPropertyActionListener value="#{customers}" target="#{CustomerManagedBean.selectedViewCustomer}" />  
                                                <f:setPropertyActionListener value="#{true}" target="#{CustomerManagedBean.editMode}" />  
                                            </p:commandLink>                                                                
                                        </p:column>

                                        <p:rowExpansion>  
                                            <h:panelGrid id="display" columns="6" cellpadding="3"
                                                         style="font-family:Tahoma; font-size:10px;border-color:transparent;column-rule-style:hidden">

                                                <h:outputText value="Customer Id" />  
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.id}" />

                                                <h:outputText value="Date Created" />  
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.dateCreated}" />  

                                                <h:outputText value="Company Name" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.name}" /> 

                                                <h:outputText value="Company Registration Id" />  
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.companyRegId}" />

                                                <h:outputText value="Business Type" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.businessType}" />

                                                <h:outputText value="Industry" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.industry}" />

                                                <h:outputText value="Phone Number" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.contactNum}" />

                                                <h:outputText value="Annual Revenue" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.annualRevenue}" />

                                                <h:outputText value="Ownership" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.ownership}" />

                                                <h:outputText value="Number of Employees" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.numOfEmployees}" />

                                                <h:outputText value="Fax Number" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.faxNum}" />  

                                                <h:outputText value="Website" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.website}" />

                                                <h:outputText value="Email Address" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.emailAddress}" />

                                                <h:outputText value="Rating" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.rating}" />

                                                <h:outputText value="Ticker Symbol" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.tickerSymbol}" />

                                                <h:outputText value="SIC Code" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.sicCode}" />

                                                <h:outputText value="Assigned Customer Executive" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.custExName}" /> 

                                                <h:outputText value="" />
                                                <h:outputText value=""/>
                                                <h:outputText value="" /> 

                                                <h:outputText value="Street Address" /> 
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.address}" /> 

                                                <h:outputText value="State" /> 
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.addressState}" />

                                                <h:outputText value="Country" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.country}" />  

                                                <h:outputText value="City" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.city}" />  

                                                <h:outputText value="Postal Code" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.postalCode}" /> 

                                                <h:outputText value="Description" />
                                                <h:outputText value=":"/>
                                                <h:outputText value="#{customers.description}" /> 

                                            </h:panelGrid>  
                                        </p:rowExpansion> 


                                    </p:dataTable>

                                    <p:ajaxStatus style="width:16px;height:16px;">  
                                        <f:facet name="start">  
                                            <h:graphicImage value="25(2).gif" />  
                                        </f:facet>  

                                        <f:facet name="complete">  
                                            <h:outputText value="" />  
                                        </f:facet>  
                                    </p:ajaxStatus>
                                </td>
                            </tr>
                            <tr></tr>
                        </table>



                        <!--DIALOG FOR VIEW-->
                        <p:dialog header="Customer Detail" widgetVar="editDialog" resizable="false"  
                                  modal="true" width="700" showEffect="blind" hideEffect="blind">  

                            <center>
                                <h:panelGrid id="display1" columns="6" cellpadding="2" cellspacing="2" style="font-family:Tahoma; font-size:10px">  


                                    <h:outputText value="Customer Id" />  
                                    <h:outputText value=":"/>
                                    <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.id}" style="font-weight:bold" />  

                                    <h:outputText value="Date Created" />  
                                    <h:outputText value=":"/>
                                    <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.dateCreated}" style="font-weight:bold" />  


                                    <h:outputText value="Company Name" /> 
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.name}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.name}" rendered="#{CustomerManagedBean.editMode}" label="Company Name"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="Company Reg. ID"/>
                                    <h:outputText value=":"/>
                                    <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.companyRegId}" style="font-weight:bold" />

                                    <h:outputText value="Customer Executive" /> 
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.custExName}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>
                                        <h:selectOneMenu  value="#{CustomerManagedBean.selectedViewCustomer.custExId}">

                                            <f:selectItems value="#{CustomerManagedBean.custExList}" var="custExecutive"
                                                           itemLabel ="#{custExecutive.name}" itemValue="#{custExecutive.email}"/>
                                        </h:selectOneMenu>
                                    </h:panelGroup>

                                    <h:outputText value=""/>
                                    <h:outputText value=""/>
                                    <h:outputText value=""/>


                                    <h:outputText value="Business Type" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.businessType}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <h:selectOneMenu value="#{CustomerManagedBean.selectedViewCustomer.businessType}" rendered="#{CustomerManagedBean.editMode}">  
                                            <f:selectItem itemLabel="Direct" itemValue="Direct" />  
                                            <f:selectItem itemLabel="Wholesale" itemValue="Wholesale"/>
                                        </h:selectOneMenu>  
                                    </h:panelGroup>  

                                    <h:outputText value="Industry "/>
                                    <h:outputText value=": "/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.industry}"  style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>
                                        <h:selectOneMenu value="#{CustomerManagedBean.selectedViewCustomer.industry}" rendered="#{CustomerManagedBean.editMode}">
                                            <f:selectItem itemLabel="-None-" itemValue=""/>
                                            <f:selectItem itemLabel="Agriculture" itemValue="Agriculture"/>
                                            <f:selectItem itemLabel="Apparel" itemValue="Apparel"/>
                                            <f:selectItem itemLabel="Banking" itemValue="Banking"/>
                                            <f:selectItem itemLabel="Biotechnology" itemValue="Biotechnology"/>
                                            <f:selectItem itemLabel="Chemicals" itemValue="Chemicals"/>
                                            <f:selectItem itemLabel="Communications" itemValue="Communications"/>
                                            <f:selectItem itemLabel="Construction" itemValue="Construction"/>
                                            <f:selectItem itemLabel="Consulting" itemValue="Consulting"/>
                                            <f:selectItem itemLabel="Education" itemValue="Education"/>                              
                                            <f:selectItem itemLabel="Electronics" itemValue="Electronics"/>
                                            <f:selectItem itemLabel="Energy" itemValue="Energy"/>
                                            <f:selectItem itemLabel="Engineering" itemValue="Engineering"/>
                                            <f:selectItem itemLabel="Entertainment" itemValue="Entertainment"/>
                                            <f:selectItem itemLabel="Environmental" itemValue="Environmental"/>
                                            <f:selectItem itemLabel="Finance" itemValue="Finance"/>
                                            <f:selectItem itemLabel="Food and Beverage" itemValue="Food and Beverage"/>
                                            <f:selectItem itemLabel="Government" itemValue="Government"/>
                                            <f:selectItem itemLabel="Healthcare" itemValue="Healthcare"/>
                                            <f:selectItem itemLabel="Hospitality" itemValue="Hospitality"/>
                                            <f:selectItem itemLabel="Insurance" itemValue="Insurance"/>
                                            <f:selectItem itemLabel="Machinery" itemValue="Machinery"/>
                                            <f:selectItem itemLabel="Manufacturing" itemValue="Manufacturing"/>
                                            <f:selectItem itemLabel="Media" itemValue="Media"/>
                                            <f:selectItem itemLabel="Not For Profit" itemValue="Not For Profit"/>
                                            <f:selectItem itemLabel="Recreation" itemValue="Recreation"/>
                                            <f:selectItem itemLabel="Retail" itemValue="Retail"/>
                                            <f:selectItem itemLabel="Shipping" itemValue="Shipping"/>
                                            <f:selectItem itemLabel="Technology" itemValue="Technology"/>
                                            <f:selectItem itemLabel="Telecommunications" itemValue="Telecommunications"/>
                                            <f:selectItem itemLabel="Transportation" itemValue="Transportation"/>
                                            <f:selectItem itemLabel="Utilities" itemValue="Utilities"/>
                                            <f:selectItem itemLabel="Other" itemValue="Other"/>
                                        </h:selectOneMenu>
                                    </h:panelGroup>

                                    <h:outputText value="Phone Number" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.contactNum}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}" />  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.contactNum}" rendered="#{CustomerManagedBean.editMode}" label="Phone Number"/>
                                    </h:panelGroup> 

                                    <h:outputText value="Annual Revenue" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.annualRevenue}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}" />  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.annualRevenue}" rendered="#{CustomerManagedBean.editMode}" label="Annual Revenue"/>
                                    </h:panelGroup> 

                                    <h:outputText value="Ownership" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.ownership}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}" />  
                                        <h:selectOneMenu value="#{CustomerManagedBean.selectedViewCustomer.ownership}" rendered="#{CustomerManagedBean.editMode}">
                                            <f:selectItem itemLabel="-None-" itemValue=""/>
                                            <f:selectItem itemLabel="Other" itemValue="Other"/>
                                            <f:selectItem itemLabel="Private" itemValue="Private"/>
                                            <f:selectItem itemLabel="Public" itemValue="Public"/>
                                            <f:selectItem itemLabel="Subsidiary" itemValue="Subsidiary"/> </h:selectOneMenu>                             
                                    </h:panelGroup> 

                                    <h:outputText value="Number of Employees" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.numOfEmployees}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}" />  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.numOfEmployees}" rendered="#{CustomerManagedBean.editMode}" label="Number of Employees"/>
                                    </h:panelGroup>

                                    <h:outputText value="Fax Number" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.faxNum}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}" />  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.faxNum}" rendered="#{CustomerManagedBean.editMode}" label="Fax Number"/>
                                    </h:panelGroup>

                                    <h:outputText value="Website" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.website}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}" />  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.website}" rendered="#{CustomerManagedBean.editMode}" label="Website"/>
                                    </h:panelGroup> 

                                    <h:outputText value="Email Address" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.emailAddress}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.emailAddress}" rendered="#{CustomerManagedBean.editMode}" label="Email Address"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="Rating" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.rating}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <h:selectOneMenu value="#{CustomerManagedBean.selectedViewCustomer.rating}" rendered="#{CustomerManagedBean.editMode}">
                                            <f:selectItem itemLabel="0" itemValue="0"/>
                                            <f:selectItem itemLabel="1" itemValue="1"/>
                                            <f:selectItem itemLabel="2" itemValue="2"/>
                                            <f:selectItem itemLabel="3" itemValue="3"/>
                                            <f:selectItem itemLabel="4" itemValue="4"/>
                                            <f:selectItem itemLabel="5" itemValue="5"/>
                                        </h:selectOneMenu>
                                    </h:panelGroup>  

                                    <h:outputText value="Ticker Symbol" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.tickerSymbol}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.tickerSymbol}" rendered="#{CustomerManagedBean.editMode}" label="Ticker Symbol"/>  
                                    </h:panelGroup>

                                    <h:outputText value="SIC Code" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.sicCode}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.sicCode}" rendered="#{CustomerManagedBean.editMode}" label="SIC Code"/>  
                                    </h:panelGroup>


                                    <h:outputText value="" />
                                    <h:outputText value=""/>
                                    <h:outputText value=""/>

                                    <h:outputText value="" />
                                    <h:outputText value=""/>
                                    <h:outputText value=""/>

                                    <h:outputText value="Address" /> 
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.address}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}" />  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.address}" rendered="#{CustomerManagedBean.editMode}" label="Address"/>
                                    </h:panelGroup>

                                    <h:outputText value="State" /> 
                                    <h:outputText value=":"/>
                                    <h:panelGroup>
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.addressState}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}" />  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.addressState}" rendered="#{CustomerManagedBean.editMode}" label="State"/>
                                    </h:panelGroup>

                                    <h:outputText value="Country" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.country}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.country}" rendered="#{CustomerManagedBean.editMode}" label="Country"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="City" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.city}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.city}" rendered="#{CustomerManagedBean.editMode}" label="City"/>  
                                    </h:panelGroup>    

                                    <h:outputText value="Postal Code" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.postalCode}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.postalCode}" rendered="#{CustomerManagedBean.editMode}" label="Postal Code"/>  
                                    </h:panelGroup>   

                                    <h:outputText value=""/>
                                    <h:outputText value=""/>
                                    <h:outputText value=""/>

                                    <h:outputText value="Billing Street" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.billingStreet}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.billingStreet}" rendered="#{CustomerManagedBean.editMode}" label="Postal Code"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="Shipping Street" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.shippingStreet}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.shippingStreet}" rendered="#{CustomerManagedBean.editMode}" label="Postal Code"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="Billing State" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.billingState}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.billingState}" rendered="#{CustomerManagedBean.editMode}" label="Postal Code"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="Shipping State" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.shippingState}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.shippingState}" rendered="#{CustomerManagedBean.editMode}" label="Postal Code"/>  
                                    </h:panelGroup>

                                    <h:outputText value="Billing City" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.billingCity}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.billingCity}" rendered="#{CustomerManagedBean.editMode}" label="Postal Code"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="Shipping City" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.shippingCity}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.shippingCity}" rendered="#{CustomerManagedBean.editMode}" label="Postal Code"/>  
                                    </h:panelGroup> 

                                    <h:outputText value="Billing Code" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.billingCode}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.billingCode}" rendered="#{CustomerManagedBean.editMode}"  label="Postal Code"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="Shipping Code" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.shippingCode}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.shippingCode}" rendered="#{CustomerManagedBean.editMode}" label="Postal Code"/>  
                                    </h:panelGroup>

                                    <h:outputText value="Billing Country" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.billingCountry}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.billingCountry}" rendered="#{CustomerManagedBean.editMode}"  label="Postal Code"/>  
                                    </h:panelGroup>  

                                    <h:outputText value="Shipping Country" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.shippingCountry}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.shippingCountry}" rendered="#{CustomerManagedBean.editMode}"  label="Postal Code"/>  
                                    </h:panelGroup> 


                                    <h:outputText value="Description" />
                                    <h:outputText value=":"/>
                                    <h:panelGroup>  
                                        <h:outputText value="#{CustomerManagedBean.selectedViewCustomer.description}" style="font-weight:bold" rendered="#{!CustomerManagedBean.editMode}"/>  
                                        <p:inputText value="#{CustomerManagedBean.selectedViewCustomer.description}" rendered="#{CustomerManagedBean.editMode}" label="Description"/>  
                                    </h:panelGroup>  

                                    <h:outputText value=""/>
                                    <h:outputText value=""/>
                                    <h:outputText value=""/>
                                    <h:outputText value=""/>
                                    <h:outputText value=""/>
                                    <h:outputText value=""/>

                                    <h:outputText value=""/>
                                    <h:outputText value=""/>

                                    <p:outputPanel rendered="#{CustomerManagedBean.editMode}" layout="block" style="text-align:right">  
                                        <p:commandButton value="Save" update="panel" actionListener="#{CustomerManagedBean.save}"   
                                                         oncomplete="editDialog.hide()" image="ui-icon ui-icon-check" />  
                                        <p:commandButton value="Cancel" onclick="editDialog.hide()" type="button" image="ui-icon ui-icon-close"/>  
                                    </p:outputPanel>  


                                </h:panelGrid>  
                            </center>
                        </p:dialog>


                        <!--DIALOG FOR DELETING SINGLE ROW OF ADDRESS--> 
                        <p:confirmDialog message="Are you sure you want to delete this Address?"  
                                         showEffect="blind" hideEffect="blind" modal="true"
                                         header="Delete Address" severity="alert" widgetVar="addressdialog">  
                            <center>
                                <p:commandButton value="Yes" update="panel growl" ajax="true" immediate="true" oncomplete="addressdialog.hide()"  
                                                 actionListener="#{CustomerManagedBean.deleteAddress}" />  
                                <p:commandButton value="No" onclick="addressdialog.hide()" type="button" />   
                            </center>
                        </p:confirmDialog> 


                        <!--DIALOG FOR DELETING SINGLE ROW OF CUSTOMER--> 
                        <p:confirmDialog message="Are you sure you want to delete this customer?"  
                                         showEffect="blind" hideEffect="explode" modal="true"
                                         header="Delete Customer" severity="alert" widgetVar="customerdialog">  
                            <center>
                                <p:commandButton value="Yes" update="panel" ajax="true" immediate="true" oncomplete="customerdialog.hide()"  
                                                 actionListener="#{CustomerManagedBean.delete}" />  
                                <p:commandButton value="No" onclick="customerdialog.hide()" type="button" />   
                            </center>
                        </p:confirmDialog> 

                        <!--DIALOG FOR DELETING MULTIPLE ROW OF CUSTOMER-->
                        <p:dialog header="Delete Selected Records" modal="true" widgetVar="deleteDialog">

                            <h:outputText value="You are about to permanently delete records." /><br /><br />
                            <h:outputText value="Are you sure you want to continue?" /><br /><br/>

                            <center>
                                <p:commandButton value="Yes" ajax="true" immediate="true" update="panel" oncomplete="deleteDialog.hide()" actionListener="#{CustomerManagedBean.deleteCustomers}" />
                                <p:commandButton value="No" oncomplete="deleteDialog.hide()" action="#{CustomerManagedBean.cancelDelete()}" /> 

                            </center>
                        </p:dialog>




                    </div>
                    <div id="bottom" class="bottom">
                        <h:graphicImage value="/image/merlionfooter.jpg"/>
                    </div>
                </h:form>
            </h:body>
        </f:view>
    </f:view>
</html>